<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet " href="//at.alicdn.com/t/font_1460058_6h09r0dcp8h.css"/>
</head>
<body>
<!--文本标题 h1最大 h6最小-->
<h1>标题文本</h1>
<h2>标题文本</h2>
<h3>标题文本</h3>
<h4>标题文本</h4>
<h5>标题文本</h5>
<h6>标题文本</h6>

<!--普通文本-->
<p><span>普通文本标签</span></p>

<!--超链接-->
<p><a href="www.baidu.com">百度</a></p>

<!--粗体-->
<p><b>我是粗体看看效果</b></p>

<!--斜体-->
<p></p><em>我是斜体看看斜度</em>

<!--图片-->
<p></p><img src="https://desk-fd.zol-img.com.cn/t_s720x360c5/g4/M03/0F/04/ChMly12pGgCIcOnWAAcYc_GRtK4AAYLWAHaBIwABxiL670.jpg">

<!--段落文本标签-->
<p>这是第一行</p>
<p>这是第二行</p>
<p>这是第三行</p>

<!--有序无序列表标签 ul和ol与li属性一定成对出现-->
<ul>
    <li>无序列表</li>
    <li>无序列表</li>
    <li>无序列表</li>
</ul>
<ol>
    <li>有序列表</li>
    <li>有序列表</li>
    <li>有序列表</li>
</ol>

<!--删除标签-->
<p></p><del>传说中的价格常用标签</del>

<!--输入框 表单的表现形式-->
<!--文本框-->
<p></p><input type="text"/> 请输入要查找的文字
<p></p><input type="password"/> 请输入密码

<!--单选框-->
<p></p><input type="radio"/>单选框的小圆点萌萌哒

<!--多个单选表现 name后的属性值“a”要一样 绑定使用-->
<p></p><input type="radio" name="a"/>选我选我选我
<input type="radio" name="a"/>选左边选左边
<input type="radio" name="a"/>选我是小狗

<!--多选框-->
<p><b><i class="iconfont iconaddmeteo"></i>请选择你的午餐</b></p><input type="checkbox"/>串串
<input type="checkbox"/>火锅
<input type="checkbox"/>麦当劳
<input type="checkbox"/>还是喝西北风吧

<!--按钮-->
<p></p><input type="button" value="这是一个不好看的按钮"/>
<p>
    <button>我才是一个正经经常使用的按钮</button>
</p>
<!--滑块-->
<input type="range"/>
<!--颜色-->
<input type="color"/><br><br>
<!--段落文本-->
<textarea>请输入内容</textarea><br><br>

<!--弱提示-->
<input type="text" placeholder="请输入用户名"/><br>
<input type="password" placeholder="请输入密码"/><br><br>

<!--下拉框 两个属性一起出现-->
<span><i class="iconfont iconerke"></i>请选择你喜欢的水果</span>
<select>
    <option>香蕉</option>
    <option>苹果</option>
    <option>梨</option>
    <option>百香果</option>
    <option>柠檬</option>
</select><br>

</body>
</html>